<template>
	<vCommonPage class="hsjcsq" type="1" title="核酸检测申请">
<!--    <div slot="customContent" style="width: 100%;height: 100%;" v-if="showConfirm">-->
    <div slot="customContent" style="width: 100%;height: 100%;" v-if="false">
			<div class="CenterBoxByHs">
				请确认新型冠状病毒核酸申请信息
			</div>
			<div class="TextBox">
				<div class="TextBoxItem flex" v-for="(item,index) in detailList" :key="'info1-'+index">
					<div class="TextLeft">{{item.name}}</div>
					<div class="TextRight">{{item.value}}</div>
				</div>
				<div class="xyZ">
					<el-button class="TextBoxBtom" @click="makeSure()">
						确认
					</el-button>
          <el-button class="TextBoxBtom" @click="back()">
            返回
          </el-button>
				</div>
			</div>
			<div class="bottomBox">
				<el-button type="primary" class="BtnTextHome" @click="goBack()">返回</el-button>
				<el-button type="primary" class="BtnTextHome" @click="goBackHome()">首页</el-button>
			</div>
		</div>
<!--    <div slot="customContent" style="width: 100%;height: 100%;" v-if="!showConfirm">-->
    <div slot="customContent" style="width: 100%;height: 100%;">
      <div class="CenterBoxByHs">
        请选择核酸项目
      </div>
      <div class="TextBox">
        <div class="TextRight" >
<!--          <div><el-radio v-model="selected" :label="item.itemId">{{item.itemName}}</el-radio><br/><br/><br/><br/><br/></div>-->
          <el-radio-group v-model="selected" size="large" @change="mksureItem">
            <div v-for="item in items" style="margin-top: 75px;margin-bottom: 35px">
              <el-radio :label="item.itemId">{{item.itemName}}</el-radio>
            </div>
            <div class="TextBox" v-if="showConfirm">
              <div class="TextBoxItem flex" v-for="(item,index) in detailList" :key="'info1-'+index">
                <div class="TextLeft">{{item.name}}</div>
                <div class="TextRight">{{item.value}}</div>
              </div>
              <div class="xyZ">
                <el-button class="TextBoxBtom" @click="makeSure()">
                  确认
                </el-button>
              </div>
            </div>
          </el-radio-group>
        </div>
      </div>
<!--      <div class="xyZ">-->
<!--        <el-button class="TextBoxBtom" @click="mksureItem()">-->
<!--          确认-->
<!--        </el-button>-->
<!--      </div>-->
      <div class="bottomBox">
        <el-button type="primary" class="BtnTextHome" @click="goBack()">返回</el-button>
        <el-button type="primary" class="BtnTextHome" @click="goBackHome()">首页</el-button>
      </div>
    </div>
	</vCommonPage>
</template>

<script>
	import {
		getMonday,
		getDate,
		getLastDadyDay,
		changeChineToDate,
		checkFreeDayByDateStr,
		fun_date
	} from "../../assets/js/getTime.js"
	import {
		getNucleicAcidItems,
		nucleicAcidNucleicOrder
	} from "@api/apiBox/hsyy"
	export default {
		name: "mzgh",
		data() {
			return {
				detailList: [],
				age: this.ages(this.$store.state.user.userinfo.birthday),
				proData:{},
        showConfirm:false,
        items:[],
        selected:""
			};
		},
		methods: {
			ReckonTime() {},
			//跳转到门诊结算页面
			async makeSure() {
				let data = {
					data: {
						patientId: this.$store.state.user.userinfo.patientId, //患者ID
						itemId:this.proData.itemId,
						totalFee:this.proData.totalFee,
						idNo : this.$store.state.user.userinfo.idNo
					},
					that: this
				}
				const res = await nucleicAcidNucleicOrder(data);
				//跳转到门诊结算页面
				this.$router.push({
					name: 'mzjf',
					query: {
						title: '门诊缴费',
						code: 'mzjf'
					}
				})
			},
      async back() {
        this.showConfirm=false;
      },
      mksureItem(){
        if(this.selected==""){
          this.$message({
            type: 'error',
            message: '请先选择核酸预约项目！'
          });
          return;
        }
			  this.showConfirm=true;
        // let proData = res.data[0];
        let proData = {};
        console.log("当前选择selected:");
        console.log(this.selected);
        for (let i=0;i<this.items.length;i++) {
          if(this.items[i].itemId==this.selected){
            proData=this.items[i];
          }
        }
        this.detailList = [
          // {
          //   name: '姓名:',
          //   value: this.$store.state.user.userinfo.patientName
          // },
          // {
          //   name: '就诊卡号:',
          //   value: this.$store.state.user.userinfo.idNo
          // }, {
          //   name: '身份证号:',
          //   value: this.$store.state.user.userinfo.idNo
          // },
          {
            name: '项目名称:',
            value: proData.itemName
          }, {
            name: '项目费用:',
            value: proData.itemPrice
          }, {
            name: '检测费用:',
            value: proData.checkPrice
          }, {
            name: '费用类型:',
            value: '自费'
          }, {
            name: '总金额:',
            value: proData.totalFee
          }
        ];
        proData.patientName = this.$store.state.user.userinfo.patientName;
        proData.idNo = this.$store.state.user.userinfo.idNo;
        proData.sex = this.$store.state.user.userinfo.sex;
        this.$store.dispatch("appointment/updateHsyyInfo", proData); //存储锁单信息
        this.proData = proData;
        console.log('store',this.$store.state.appointment.hsyyInfo)
      },
			//初始化表单信息
			async initData() {
				let data = {
					data: {
					},
					that: this
				}
				const res = await getNucleicAcidItems(data);

				if (res.data) {
					if (res.data.length > 0) {
					  this.items=res.data;
					}
				}
			},
			ages(str) {
				if (!str) {
					return '';
				}
				var r = str.match(/^(\d{1,4})(-|\/)(\d{1,2})\2(\d{1,2})$/);
				if (r == null) return false;
				var d = new Date(r[1], r[3] - 1, r[4]);
				if (d.getFullYear() == r[1] && (d.getMonth() + 1) == r[3] && d.getDate() == r[4]) {
					var Y = new Date().getFullYear();
					return (Y - r[1]);
				}
				return ("");
			}
		},
		computed: {

		},
		components: {},
		mounted() {},
		created() {
			console.log(this.$store.state, 'sss')
			this.initData();
		}
	};
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
	@import "../../assets/css/mzghYy/qrghxx.scss";
	.CenterBoxByHs {
		font-size: 36px;
		font-family: Source Han Sans CN;
		font-weight: 400;
		color: #435C7A;
		width: 100%;
		text-align: center;
	}
  .el-radio /deep/ .el-radio__label{
    font-size:28px !important;
    margin-top: 25px !important;
    margin-left: 20px;
  }
</style>
<style>
	.hsjcsq .addChose {}

	@media (min-height: 0px) and (max-height: 1910px) {}

	@media (min-height: 1919px) {
		.hsjcsq .el-row-vertical {
			height: calc(100% - 250px);
		}
	}
</style>
